import React from 'react';
import { Table } from 'antd';
import Statistic from './components/statistic';
import QdxlChart from './components/echart/QdxlChart';

const Sjxlfx = ({ data }) => {
    const { entryHighestRateSource = '', candidateHighestRateSource = '', tableDataList, chartItemVOList } = data;
    const columns = [
        {
            title: 'Top渠道',
            dataIndex: 'topName'
        },
        {
            title: '部门筛选通过率',
            dataIndex: 'filter'
        },
        {
            title: '面试通过率',
            dataIndex: 'interview'
        },
        {
            title: '入职占比',
            dataIndex: 'entry'
        }
    ];
    return (
        <div>
            <Statistic
                title="渠道效率分析"
                data={{
                    top: '入职来源占比最高',
                    center: <strong>{entryHighestRateSource === '' ? '--' : entryHighestRateSource}</strong>,
                    bottom: (
                        <span>
                            人才来源占比最高：{candidateHighestRateSource === '' ? '--' : candidateHighestRateSource}
                        </span>
                    )
                }}
            />
            <QdxlChart data={chartItemVOList} />
            <Table size="small" columns={columns} dataSource={tableDataList} pagination={false} bordered />
        </div>
    );
};

export default Sjxlfx;
